<template>  
    <div class="goods-list-item" @click="clickItem">
        <img :src="showImage" class="goods-list-item-img" > 
        <div class="goods-list-item-p">
            <p>{{goodsItem.title}}</p>
            <span class="price">{{goodsItem.price}}</span>
            {{"  "}}
            <span class="collect">{{goodsItem.cfav}}</span>
        </div>
    </div>
</template>



<script>

    export default {
    name: 'GoodsListItem',
    components:{
    },
    props:{
        goodsItem: {
            type:Object,
            default(){
                return {}
            }
        }
    },
    data(){
      return {

      }
    },
    created() {
    },
    methods:{
        
        imageLoad(){
            this.$bus.emit('itemImageLoad')
        },
        clickItem(){
            let iid = this.goodsItem.iid
            if(iid)
                this.$router.push("/Detail/"+iid)
            else {
                this.$bus.emit("itemClick",this.goodsItem.item_id)
            }
            
        }
    },
    computed: {
        showImage() {
        return this.goodsItem.img || this.goodsItem.image || this.goodsItem.show.img
        }
    }
    ,mounted(){
    }
  }
</script>

<style>
    .goods-list-item {
        font-size: 15px;
        width: 50%;
    }
    .goods-list-item-img {
        width: 100%;
        height: 70%;
    }
    .goods-list-item-p {
        text-align: center;
    }
    .price {
        color: red;
    }
</style>